<!-- 统计报表 -->
<template>
   <page-header-wrapper>
    <a-card class="table-card">

    <!-- 平台活动统计报表 -->
      <GzSearchForm class="form">
        <a-form-item label="" class="table-search-item">
          <GzDateRangePicker placeholder="参与开始时间"></GzDateRangePicker>
        </a-form-item>
        <a-form-item label="" class="table-search-item">
          <GzDateRangePicker placeholder="参与结束时间"></GzDateRangePicker>
        </a-form-item>

        <a-form-item label="" class="table-search-item">
          <a-select v-model:value="searchData['awardClass']" placeholder="奖品等级">
            <a-select-option value="1">一等奖</a-select-option>
            <a-select-option value="2">二等奖</a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item label="" class="table-search-item">
          <a-select v-model:value="searchData['awardState']" placeholder="奖品领取状态">
            <a-select-option value="1">已领取</a-select-option>
            <a-select-option value="2">未领取</a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item label="" class="table-search-item">
          <a-select v-model:value="searchData['awardVerify']" placeholder="奖品核销状态">
            <a-select-option value="1">已核销</a-select-option>
            <a-select-option value="2">未核销</a-select-option>
          </a-select>
        </a-form-item>

        <a-form-item label="" class="table-search-item">
          <GzDateRangePicker placeholder="核销开始时间"></GzDateRangePicker>
        </a-form-item>
        <a-form-item label="" class="table-search-item">
          <GzDateRangePicker placeholder="核销结束时间"></GzDateRangePicker>
        </a-form-item>

      </GzSearchForm>

      <GzTable
          ref="infoTableRef"
          :init-data="true"
          :req-table-data-func="reqTableDataFunc"
          :table-columns="platformTableColumns"
          :search-data="searchData"
          :tableExportFunc="tableExportFunc"
        >
      </GzTable>
    </a-card>
  </page-header-wrapper>
    
</template>

<script setup>
import { ref, reactive, computed, defineExpose } from 'vue'

const infoTableRef = ref()

const vdata = reactive({
})

const platformTableColumns = reactive([
  { key: 'couponName', title: '活动名称',dataIndex: 'couponName', fixed: 'left', width: 200, minWidth: 150, maxWidth: 250 },
  { key: 'couponId', title: '活动编号',dataIndex: 'couponId', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'awardName', title: '奖品名称',dataIndex: 'awardName', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'awardType', title: '奖品类型',dataIndex: 'awardType', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'awardClass', title: '奖品等级',dataIndex: 'awardClass', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'awardPrize', title: '奖品价值',dataIndex: 'awardPrize', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'awardState', title: '奖品领取状态',dataIndex: 'awardState', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'awardVerify', title: '奖品核销状态',dataIndex: 'awardVerify', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'partTime', title: '参与时间', dataIndex: 'partTime', width: 140, minWidth: 140, maxWidth: 170 },
  { key: 'verifyTime', title: '核销时间', dataIndex: 'verifyTime', width: 140, minWidth: 140, maxWidth: 170 },
  { key: 'account', title: '核销账户',dataIndex: 'account', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'name', title: '参与人姓名',dataIndex: 'name', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'wxOPID', title: '参与人微信OPID',dataIndex: 'wxOPID', width: 150, minWidth: 150, maxWidth:170  },
  { key: 'phone', title: '参与人手机号',dataIndex: 'phone', width: 150, minWidth: 150, maxWidth:170  },
])

const searchData = ref({
  couponName: ''
})

const title = computed(()=>{
  if(vdata.platform == 1){
    return '平台活动统计报表'
  }else if(vdata.platform == 2){
    return '互动游戏统计报表'
  }else{
    return '统计报表'
  }
})

function reqTableDataFunc(){
  return Promise.resolve({
    total: 1,
    records:[
      {
        couponName: '818理财节',
        couponId: 'Z10000000',
        couponState: '未开始',
        orderMoney: '100000',
        disMoney: '6000',
        payMoney: '94000',
        partTime: '2023-10-23',
        mchName: '赵六',
        agentName: '测试机构一'
      }
    ]
  })
}

function tableExportFunc(){ // 下载报表
  
}


</script>

<style scoped lang="less">
.form{
  display: flex;
  flex-wrap: wrap;
  padding: 10px 20px 10px 20px;
  .form-item{
    display: flex;
    padding: 10px;
    width: calc(100% / 4);
    margin-bottom: 0;
    flex-shrink: 1;
    @media (max-width: 1735px){
      width: calc(100% / 3);
    } 
    @media (max-width: 1340px){
      width: calc(100% / 2);
    } 
    @media (max-width: 955px){
      width: calc(100% / 1);
    }
  }
}
</style>